<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="common.jsp" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html style="font-size: 100px;">
  <head>
    <base href="<%=basePath%>">
    
    <title>智慧消防</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/amazeui.min.css" type="text/css"></link>
	<style type="text/css">
        body{
            background-color: #f1f1f1;
        }
		[data-am-widget=tabs] {
		    margin: 0px;
		    height: 100%;
		}
		li{
			background-color: white;
			border-bottom: 1px solid #eee;
		}
		.am-tabs-bd .am-tab-panel{
			padding: 0px;
		}
        label{
            width:20%;
            white-space:nowrap;
            margin-right: 0.05rem;
        }
	</style>
	<script type="text/javascript">
		/* 获取未处理信息 */
		function getAlarm(alarmStatus){
  			var url = '${linkPath}smartfire/wx/operationList/getList';
  			var data = {
  				'alarmStatus': alarmStatus,
  				'userId': userId
  			};
  			   $.ajax({
		        url:url,
		        type: 'get',
		        data: data,
                   beforeSend: function(request) {
                       request.setRequestHeader("ACCESS-TOKEN", token);
                   },
		        success: function(res){
		            alarmArr = res.obj;
		            var alarm = '';
		            var alarmType='';
		            $('.alarm').html('');
		            for(var i=0;i<alarmArr.length;i++){
		            	if(alarmArr[i].alarmType == '1'){
		            		alarmType = '预警';
		            	}else if(alarmArr[i].alarmType == '2'){
		            		alarmType = '故障';
		            	}else if(alarmArr[i].alarmType == '3'){
		            		alarmType = '火警';
		            	}


		            	var address = alarmArr[i].address;
                        if (address == 'null' || address == null) {
                            address = '厦门市集美区灌口机电工业区后山头路39号';
                        }
                        alarm += '<div style="background-color: white;margin-bottom: 1.5px;border: 1px solid #ccc;border-radius: 2px;">';
                        alarm += '<div style="padding: 0 0.2rem;font-size: 0.15rem;height: 0.4rem;line-height: 0.4rem;">';
                        alarm += '<label>设备名称：'+alarmArr[i].deviceName+'</label>';
                        alarm += '<span style="float: right;">'+alarmType+'</span>';
                        alarm += '</div>';
                        alarm += '<div style="border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;padding: 0 0.25rem;">';
                        alarm += '<div style="line-height: 0.25rem;height: 0.25rem;"><label>设备ID:</label> <span style="color: #666666;">'+ alarmArr[i].deviceId +'</span></div>';
                        alarm += '<div style="line-height: 0.25rem;height: 0.25rem;"><label>报警位置:</label>'+address+'</div>';
                        alarm += '<div style="line-height: 0.25rem;height: 0.25rem;"><label>备注:</label>'+(alarmArr[i].remark == 'null' ? "无":alarmArr[i].remark)+'</div>';
                        alarm += '<div style="line-height: 0.25rem;height: 0.25rem;"><label>报警时间:</label>'+(alarmArr[i].recordTime).substring(0, 19)+'</div>';
                        if(alarmStatus=='1'){
                            alarm += '<div><label>处理结果:</label>'+(alarmArr[i].handlerResult == null ? "未处理":alarmArr[i].handlerResult)+'</div>';
                        }
                        alarm += '</div>';
                        if(alarmStatus=='1') {
                            alarm += '<div style="height: 0.4rem;line-height: 0.4rem;">';
                            alarm += '<div style="right: 0.05rem;top: 0.1rem;color: #fa4b28;">';
                            alarm += '<a style="float: right;border: 1px solid #fa4b28;border-radius: 5px;padding: 8px;margin-right: 0.08rem;margin-top: 0.05rem;line-height: 0.1rem;" href="javascript:(0);" onclick="submitHandleResult(\''+alarmArr[i].id+'\',\''+alarmArr[i].deviceId+'\')">立即处理';
                            alarm += '</a>';
                            alarm += '</div>';
                            alarm += '</div>';
                        }
                        alarm += '</div>';
		            }
		            if(alarmStatus=='1'){
		            	$('.alarm-1').append(alarm);
		            }else if(alarmStatus=='2'){
			            $('.alarm-2').append(alarm);
		            }
		            
		        },
		        error: function(error){
		            console.log(error);
		        }
		    });
  		}
	    function submitHandleResult(id,deviceId){
	    	location.href ='<%=path %>/login/handleResult.jsp?id='+id+'&deviceId='+deviceId;
	    }
	</script>
  </head>
  
  <body onload="getAlarm('1')">
    <div data-am-widget="tabs" class="am-tabs am-tabs-d2" >
      <ul class="am-tabs-nav am-cf" style="position: fixed;z-index: 1000;width: 100%">
          <li class="am-active"><a onclick="getAlarm('1')">未处理</a></li>
          <li class=""><a onclick="getAlarm('2')">已处理</a></li>
      </ul>
      <div class="am-tabs-bd" style="padding: 45px 0;border: 0px">
          <div data-tab-panel-0 class="am-tab-panel am-active alarm alarm-1" ></div>
          <div data-tab-panel-1 class="am-tab-panel alarm alarm-2">
            
          </div>
      </div>
  </div>
  <div>
	<ul id="common-bottom" class="am-avg-sm-3">
	    <li>
	        <a href="<%=path %>/login/main.jsp"><img class="am-thumbnail" src="<%=path %>/images/nav/home_normal.png"></img>首页</a>
	    </li>
        <li>
            <a href="<%=path%>/login/maintenanceTask.jsp "><img class="am-thumbnail" src="<%=path %>/images/nav/maintenance_normal.png"></img>巡检</a>
        </li>
	    <li>
	        <a class="bottom-active"><img class="am-thumbnail" src="<%=path %>/images/nav/operationList_select.png"></img>维修</a>
	    </li>
        <li>
            <a href="<%=path%>/login/mine.jsp "><img class="am-thumbnail" src="<%=path %>/images/nav/mine_normal.png"></img>我</a>
        </li>
	</ul>
  </div>
  </body>
</html>
